<%-- 
    Document   : template
    Created on : Aug 18, 2014, 5:50:08 AM
    Author     : HT
--%>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>Admin New User</title>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link type="text/css" href="resources/main/css/bootstrap.min.css"
	rel="stylesheet">
<link type="text/css"
	href="resources/main/css/bootstrap-responsive.min.css" rel="stylesheet">
<link type="text/css" href="resources/main/css/theme.css"
	rel="stylesheet">
<link type="text/css" href="resources/main/css/font-awesome.css"
	rel="stylesheet">
<link type="text/css"
	href='http://fonts.googleapis.com/css?family=Open+Sans:400italic,600italic,400,600'
	rel='stylesheet'>
<link rel="stylesheet"
	href="//code.jquery.com/ui/1.11.1/themes/smoothness/jquery-ui.css">
<%-- 
    Java Script
    --%>
<script src="resources/main/js/jquery-1.9.1.min.js"
	type="text/javascript"></script>
<script src="resources/main/js/jquery-ui-1.10.1.custom.min.js"
	type="text/javascript"></script>
<script src="resources/main/js/bootstrap.min.js" type="text/javascript"></script>
<script src="resources/main/js/jquery.flot.js" type="text/javascript"></script>
<script src="resources/main/js/jquery.flot.resize.js"
	type="text/javascript"></script>
<script src="resources/main/js/common.js" type="text/javascript"></script>

<script src="//code.jquery.com/ui/1.11.1/jquery-ui.js"></script>

	</head>
    <body>
        <div class="navbar navbar-fixed-top">
            <%@include file="head-banner.jsp" %>
            <!-- /navbar-inner -->
        </div>
        <!-- /navbar -->
        <div class="wrapper">
            <div class="container">
                <div class="row">
                    <%@include file="left-banner.jsp" %>
                    <!--/.span3-->
                    <div class="span9">
                        <div class="content" style="width: 100%">
                            <div class="module message">
                                <div class="module-head">
                                    <h3>
                                        New User Registration</h3>
                                </div>
                                <div class="module-option clearfix" >
                                    <form action="SearchNewUserRegistrationByAdvanced.html" method="POST">
                                        <div>
                                            <div class="input-append pull-left">
                                                <input type="text" name="SearchByName" class="span3" placeholder="Search By Name...">
                                                <button type="submit" class="btn">
                                                    <i class="icon-search"></i>
                                                </button>
                                            </div>
                                            <a id="btnShowAdvanceSearch" style="float: left;padding-left: 10px;padding-right: 10px;padding-top: 5px">Advance Search</a>
                                            <div class="pull-right">
                                                <a href="toAdminRegisterPage.html" class="btn btn-primary" style="width: 100px;">New Account</a>
                                                 <c:choose>
                                               	<c:when test="${role == 3}">
                                               		<button type="submit" id="action" class="btn btn-primary" form="NewUserAreWating" name="action" value="Approve New User">Approve</button>
													<button type="submit" id="action" class="btn btn-primary" form="NewUserAreWating" name="action" value="Reject New User">Reject</button>
                                               	</c:when>
                                               	<c:otherwise>
                                               		<button type="submit" class="btn btn-primary" form="NewUserAreWating" name="action" value="Approve New User">Approve</button>
													<button type="submit" class="btn btn-primary" form="NewUserAreWating" name="action" value="Reject New User">Reject</button>
                                               	</c:otherwise>
                                               </c:choose>
                                            </div>
                                        </div>
                                        <br><br>
                                        <div id="panelAdvanceSearch" style="text-align: left;display: none;">
                                            <div style="display: block">
                                                <div class="" style="width: 220px;float: left">
                                                    <label for="">Login Id: </label>
                                                    <div class="controls row-fluid">
                                                        <input class="span12" type="text" id="" name="LoginId" placeholder="Login Id">
                                                    </div>
                                                </div>
                                                <div class="" style="width: 220px;float: left;margin-left: 30px;">
                                                    <label for="">ID Card Number: </label>
                                                    <div class="controls row-fluid">
                                                        <input class="span12" type="text" id="" name="IdCardNumber" placeholder="ID Card Number">
                                                    </div>
                                                </div>
                                            </div>
                                            <div style="display: block;clear: both">
                                                <div class="" style="width: 220px;float: left">
                                                    <label for="">Phone: </label>
                                                    <div class="controls row-fluid">
                                                        <input class="span12" type="text" name="phone" id="" placeholder="Phone">
                                                    </div>
                                                </div>
                                                <div class="" style="width: 220px;float: left;margin-left: 30px;">
                                                    <label for="">Address: </label>
                                                    <div class="controls row-fluid">
                                                        <input class="span12" type="text" name="address" id="" placeholder="Address">
                                                    </div>
                                                </div>
                                            </div>
                                            <div style="display: block;clear: both">
                                                <div class="" style="width: 220px;float: left">
                                                    <label for="">Email: </label>
                                                    <div class="controls row-fluid">
                                                        <input class="span12" type="email" name="email" id="" placeholder="Email">
                                                    </div>
                                                </div>
                                                <div class="" style="width: 220px;float: left;margin-left: 30px">
                                                    <label class="control-label" for="basicinput">Role:</label>
                                                    <select name="role" tabindex="1" data-placeholder="" class="span8" style="width: 220px;">
                                                        <option value="">All</option>
                                                        <option value="User Admin">User Admin</option>
                                                        <option value="User Support">User Support</option>
                                                        <option value="Account Admin">Account Admin</option>
                                                        <option value="Account Support">Account Support</option>
                                                        <option value="Report Support">Report Support</option>
                                                    </select>
                                                </div>
                                            </div>
                                            <div class="" style="clear: both">
                                                <div class="controls clearfix">
                                                    <button type="reset" class="btn btn-primary pull-left" style="margin-left: 15px;">Clear</button>
                                                    <button type="button" id="btnHideAdvanceSearch" class="btn btn-primary pull-left" style="margin-left: 15px;">Hide</button>
                                                </div>
                                            </div>
                                        </div>
                                    </form>
                                    
                                </div>
              
              
              					<div id="panelProfileDetail"
									style="text-align: left; margin-top: 15px; margin-bottom: 15px;display: none;">
									<div id="detailContent">
										
											<!-- Detail Content will be loaded using json and ajax -->

										</div>
									
								</div>
								
								
                               
                                <div class="module-body table">
                                
                                <div id="panelProfileDetail"
									style="text-align: left; margin-top: 15px; margin-bottom: 15px;">
                               		<div id="detailContent">

											<!-- Detail Content will be loaded using json and ajax -->

									</div>
								</div>
								
                                <form id="NewUserAreWating" action="ApproveOrRejectNewUser.html" method="post">
                                    <table class="table table-message">
                                        <tbody>
                                         
                                            <tr class="heading">
                                                <td class="cell-check" style="width: 1%;text-align: center">
                                                    <input type="checkbox" id="checkAll" class="inbox-checkbox">
                                                </td>
                                                <td class="cell-title" style="width: 1%;text-align: center">
                                                    #
                                                </td>
                                                <td class="cell-title" style="width: 12%;text-align: center">
                                                    Username
                                                </td>
                                                <td class="cell-title" style="width: 15%;text-align: center">
                                                    Role
                                                </td>
                                                <td class="cell-title" style="width: 25%;text-align: center">
                                                    Full Name
                                                </td>
                                                <td class="cell-time" style="width: 16%;text-align: center">
                                                    Date
                                                </td>
                                                <td class="cell-time" style="width: 10%;text-align: center">
                                                    Action
                                                </td>
                                            </tr>
                                            <!--Set var count for #  -->
                                          	<c:set var="count" value="0" scope="page" />
                                            <c:forEach var="newUsers" items="${viewNewUsers}">
                                            <c:set var="count" value="${count + 1}" scope="page" />
                                            <tr class="">
                                                <td class="cell-check" style="text-align: center">
                                                    <input type="checkbox" name="checkBox" class="inbox-checkbox" value="${newUsers.accAffected.accountLoginId}">
                                                </td>
                                                <td class="cell-title" style="text-align: center">
                                                    ${count}
                                                </td>
                                                <td class="cell-title" style="text-align: center">
                                                    ${newUsers.accAffected.accountLoginId}
                                                </td>
                                                <td class="cell-title" style="text-align: center">
                                                    ${newUsers.accAffected.systemAccountType.typeName}						
                                                </td>
                                                <td class="cell-title" style="text-align: center">
                                                    ${newUsers.accAffected.accountFirstName} ${newUsers.accAffected.accountMidName} ${newUsers.accAffected.accountLastName}
                                                </td>
                                                <td class="cell-time" style="text-align: center">
                                                    ${newUsers.dateTransaction}
                                                </td>
                                           <!-- btnShowDetailApprove${count} -->
                                                <td class="cell-time" style="text-align: center">
                                                    <input type="hidden" name="actionreq" id="actionreq" value="${newUsers.accAffected.accountLoginId}">        
                                                </td>
                                            </tr>
                                            <!--@author Tran Son Hoang:Action detail new user here -->
                                            <%-- <tr id="panelDetailParentApprove${count}" style="display: none;">
                                            	<td colspan="9">
                                            		<div id="panelDetailApprove${count}" style="text-align: left;margin-top: 30px;display: none">
                                            <div class="module-head">
                                                <h3>
                                                    New User Information
                                                </h3>
                                            </div>
                                            <div style="display: block">
                                                <div class="" style="width: 220px;margin-left: 30px;float: left">
                                                    <label for="" >Username: </label>
                                                    <div class="controls row-fluid">
                                                        <input class="span12" type="text" name="usernameForApporveOrReject" id="" placeholder="" readonly="true" value="${newUsers.accAffected.accountLoginId}">
                                                    </div>
                                                </div>
                                                <div class="" style="width: 220px;margin-left: 30px;float: left">
                                                    <label for="" >ID Card Number: </label>
                                                    <div class="controls row-fluid">
                                                        <input class="span12" type="text" id="" placeholder="" readonly="true" value="${newUsers.accAffected.accountIDCardNumber }">
                                                    </div>
                                                </div>
                                            </div> 
                                            <div style="display: block;clear: both">
                                                <div class="" style="width: 220px;margin-left: 30px;float: left">
                                                    <label for="" >First Name: </label>
                                                    <div class="controls row-fluid">
                                                        <input class="span12" type="text" id="" readonly="true" value="${newUsers.accAffected.accountFirstName }" placeholder="">
                                                    </div>
                                                </div>
                                                <div class="" style="width: 220px;margin-left: 30px;float: left">
                                                    <label for="" >Middle Name: </label>
                                                    <div class="controls row-fluid">
                                                        <input class="span12" type="text" id="" readonly="true" value="${newUsers.accAffected.accountMidName }" placeholder="">
                                                    </div>
                                                </div>
                                                <div class="" style="width: 220px;margin-left: 30px;float: left">
                                                    <label for="" >Last Name: </label>
                                                    <div class="controls row-fluid">
                                                        <input class="span12" type="text" id="" readonly="true" value="${newUsers.accAffected.accountLastName }" placeholder="">
                                                    </div>
                                                </div>
                                            </div>
                                            <div style="display: block;clear: both">
                                                <div class="" style="float: left;margin-left: 30px;width: 220px;">
                                                    <label class="control-label" for="basicinput">Phone:</label>
                                                    <div class="controls row-fluid">
                                                        <input class="span12" type="text" id="" placeholder="" readonly="true" value="${newUsers.accAffected.accountPhone1 }">
                                                    </div>
                                                    <div class="controls row-fluid">
                                                        <input class="span12" type="text" id="" placeholder="" readonly="true" value="${newUsers.accAffected.accountPhone2 }">
                                                    </div>
                                                </div> 
                                                <div class="" style="float: left;margin-left: 30px;width: 220px;">
                                                    <label class="control-label" for="basicinput">Email:</label>
                                                    <div class="controls row-fluid">
                                                        <input class="span12" type="text" id="" placeholder="" readonly="true" value="${newUsers.accAffected.accountEmail1 }">
                                                    </div>
                                                    <div class="controls row-fluid">
                                                        <input class="span12" type="text" id="" placeholder="" readonly="true" value="${newUsers.accAffected.accountEmail2 }">
                                                    </div>
                                                </div>
                                                <div class="" style="float: left;margin-left: 30px;width: 220px;">
                                                    <label class="control-label" for="basicinput">Address:</label>
                                                    <div class="controls row-fluid">
                                                        <input class="span12" type="text" id="" placeholder="" readonly="true" value="${newUsers.accAffected.accountAddress1}">
                                                    </div>
                                                    <div class="controls row-fluid">
                                                        <input class="span12" type="text" id="" placeholder="" readonly="true" value="${newUsers.accAffected.accountAddress2 }">
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="" style="margin-top: 30px;clear: both">
                                                <div class="controls clearfix">
                                                    <button id="btnHideDetailApprove${count}" type="button" class="btn btn-primary pull-left" style="margin-left: 15px;">Close</button>
                                                </div>
                                            </div>
                                        </div>
                                            	</td>
                                            </tr>   --%> 
                                             </c:forEach>
                                        </tbody>
                                    </table>
                                    </form>
                                </div>
                                
                    			<input id="numberOfRow" type="hidden" value="${count}">
                            </div>
                        </div>
                        <!--/.content-->
                    </div>
                    <!--/.span9-->
                </div>
            </div>
            <!--/.container-->
        </div>

        
        <div id="dialog-message" title="Message" style="display: none;font-size: 16px;">
			<p>
				<span class="ui-icon ui-icon-circle-check"
					style="float: left; margin: 0 7px 50px 0;"></span> ${ApproveAndRejectMessage}
			</p>
		</div>
		<input type="hidden" id="messageReturn" value="${ApproveAndRejectMessage}" />
		
		
        <!--/.wrapper-->
        <div class="footer">
            <%@include file="footer.jsp" %>
        </div>                       
        </div> <!--your content end-->
    
    </div> <!--toPopup end-->
    
	<div class="loader"></div>
   	<div id="backgroundPopup"></div>
        
    </body>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
    <script>
    	var numberOfRow = $("#numberOfRow").val();

    	/* @author: Tran Son Hoang: Action for advanced search */
        $(document).ready(function() {
        	
        	
            $("#btnShowAdvanceSearch").click(function() {
                $("#panelAdvanceSearch").slideDown("slow");
            });

            $("#btnHideAdvanceSearch").click(function() {
                $("#panelAdvanceSearch").slideUp("slow");
            });
            //End - Advance Search
            
           /* @author: Tran Son Hoang: Action for detail button */
          
				function generate_ShowProfileFandler(row) {
					return function(event) {
						$("#panelDetailParentApprove" + row).show("slow");
						$("#panelDetailApprove" + row).slideDown("slow");
					};
				}

				function generate_HideProfileFandler(row) {
					return function(event) {
						$("#panelDetailApprove" + row + "").slideUp("slow");
						$("#panelDetailParentApprove" + row + "").hide("slow");
					};
				}

				for (var int = 1; int <= numberOfRow; int++) {
					var row = int.toString();

					$('#btnShowDetailApprove' + row).click(
							generate_ShowProfileFandler(row));

					$('#btnHideDetailApprove' + row).click(
							generate_HideProfileFandler(row));
				}
            /*End detail button  */
            //Checkbox all
				$(document).ready(function() {
					$('#checkAll').click(function(event) { //on click 
						if (this.checked) { // check select status
							$('.inbox-checkbox').each(function() { //loop through each checkbox
								this.checked = true; //select all checkboxes with class "checkbox1"               
							});
						} else {
							$('.inbox-checkbox').each(function() { //loop through each checkbox
								this.checked = false; //deselect all checkboxes with class "checkbox1"                       
							});
						}
					});

				});
				//End - Checkbox all
        });
    	
        
        function madeAjaxCall(){
        	var loginid= $("#actionreq").val();
        	 $.ajax({
        	  type: "post",
        	  url: "http://localhost:8080/finalproject/loadDetailNewUser.json",
        	  cache: false,    
        	  data:'loginid=' + stringify(loginid),
        	  
        	  beforeSend: function(xhr) {
                  xhr.setRequestHeader("Accept", "application/json");
                  xhr.setRequestHeader("Content-Type", "application/json");
              },
        	  success: function(response){
        	   /* var obj = JSON.parse(response); */
        	   /* $('#detailContent').html("Username" + obj.accountLoginId); */
        	   alert("result "+ response);
        	  },
        	  error: function(xhr, status, error){      
        	   alert(xhr.responseText);
        	  }
        	 });
        	 return false;
        	}
    </script>
   
</html>
